<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/include/base.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<link rel="shortcut icon" href="img/favicon.png"/>
<script  type="text/javascript"	src="static/js/pageComm.js"></script>
<script  type="text/javascript"	src="${APP_PATH }/static/js/pageListComm.js"></script>
<script type="text/javascript">
		
		$(function(){
			//打开第一页
			to_page(1);
			
			$(document).on("click",".updateRole",function(){
				//清空表单样式及内容
				reset_form("#RoleAndPowerForm");
				//隐藏 所属模块
				$("#roleModule").hide();
			 	//显示权限配置输入框
			 	$("#powerDis").show();
				//设置模态框标题
				$("#roleLabel").text("角色配置");
				//alert($(this).attr("moduleId"));
				//根据该角色所在的模块选取 相应的权限
				getPowerByModuleId("${APP_PATH}/power/"+$(this).attr("moduleId"),"#checkboxGroupPower");
				//alert($(this).attr("roleId"));
				$("#RoleAndPowerForm").append(
						$("<input type='hidden' id='roleIdHidden' name='id'></input>")
						.val($(this).attr("roleId")));
				//根据该角色id查询  角色名称 和 已经配置的权限 显示在所选框里面
				getPowerByRoleId("${APP_PATH}/role/"+$(this).attr("roleId"));
						
				
				//打开模态框
				$("#roleModal").modal({
					backdrop: "static"
				});
			});
			
			//保存获取角色  或者配置权限
			$("#saveRoleAndPower").click(function(){
				//alert($("#roleIdHidden").val());
				//return false;
				if(undefined == $("#roleIdHidden").val() || $("#roleIdHidden").val()=='' || $("#roleIdHidden").val() ==null){
					//alert("新建");
					//新建角色
					newDictionaryOther("${APP_PATH}/role","#RoleAndPowerForm","#roleModal");
					
				}else{
					//alert("更新");
					//配置权限
					updateRole();
				}
			});
			
			
			
			
			$("#newRole").click(function(){
				//清空表单样式及内容
				reset_form("#RoleAndPowerForm");
				//显示 所属模块
				$("#roleModule").show();
			 	//隐藏权限配置输入框
			 	$("#powerDis").hide();
				//设置模态框标题
				$("#roleLabel").text("新增角色");
				
				//加载所有模块
				//加载所有的模块信息  放入多选框中
			 getAllModule("${APP_PATH}/module","#roleModule select",false);

				//打开模态框
				$("#roleModal").modal({
					backdrop: "static"
				});
			});
			
			//删除一条记录
			$(document).on("click",".deleteRole",function(){
				var roleId=$(this).attr("roleId");
 				var roleName=$(this).attr("roleName");
 				
 				if(confirm("确认删除 【 "+ roleName+" 】 ？")){
 					$.ajax({
 						url:"${APP_PATH}/role/"+roleId,
 						type:"DELETE",
 						success:function(result){
 							 if(result.code == 200){
 								 //显示失败消息  失败
 								 alert(result.extend.msg);
 								 //关闭模态框
 							 }else{
 								//删除成功 返回当前页
 								 to_page(currentPage);
 							 }
 						}
 					});
 				}
			})
			
 			//删除多条消息
 			$("#deleteRoleList").click(function(){
 				
 				var checked=$("#roleMsgTable tbody input:checked");

 				 var roleIds="";
 				 var roleNames="";
 				 checked.each(function(index,value){
 					roleNames += $(this).attr("roleName")+",";
 					roleIds += $(this).attr("roleId")+"-";
 				 });
 				 roleNames=roleNames.substring(0,roleNames.length-1);
 				roleIds=roleIds.substring(0,roleIds.length-1);

 				 if(confirm("确认要删除 【 "+roleNames+" 】 吗？")){
 					 $.ajax({
 						 url:"${APP_PATH}/role/"+roleIds,
 						 type:"DELETE",
 						 success:function(result){
 							 if(result.code == 200){
 								 //显示失败消息  失败
 								 alert(result.extend.msg);
 								 //关闭模态框
 							 }else{
 								//删除成功 返回当前页
 								 to_page(currentPage);
 							 }
 						 }
 					 });
 				 }
 			});

			
		});
		
		//根据角色的id获取角色
		function getPowerByRoleId(url){
			$.ajax({
				url:url,
				type:"GET",
				success:function(result){
					showRoleFrom(result.extend.role);
				}
			});
		}
		//显示角色信息
		function showRoleFrom(role){
			$("#roleName").val(role.roleName);
			$("#roleName").attr("disabled","disabled");

			$("#checkboxGroupPower input:checkbox").each(function(index,item){
				
				for(var i=0; i<role.powers.length ;i++){
					if(role.powers[i] == item.value ){
						$(this).attr("checked","checked");
					}
				}
				
			});
		}
		
		  function getPowerByModuleId(url,ele){
			$(ele).empty();
			$.ajax({
				url:url,
				type:"GET",
				success:function(result){
					
					$.each(result.extend.list,function(index,item){
						//alert(item.power);
						//alert(item.powerName);
						$(ele).append($("<div class=checkbox'><label></label></div>")
								.append($("<input type='checkbox'></input>")
										.attr("name","power")
										.val(item.power))
								.append(item.powerName));
						
					});
				}
			});
		} 
		
		function to_page(pn){
			//alert("to_page(pn)"+pn);
			$.ajax({
				url:"${APP_PATH}/roles",
				data:"pn="+pn,
				type:"GET",
				success:function(result){
					//2. 解析并显示分页数据
	 				  build_page_info(result);
	 				 //3解析显示分页条
	 				  build_page_nav(result);
	      				//1. 解析并显示员工数据
	 				 build_emps_table(result);
	      				
				}
			});
		}

		//1. 解析并显示员工数据
			function build_emps_table(result){
				//清空table表格
		  		$("#roleMsgTable tbody").empty();
				//获取返回的dept值
				var role=result.extend.pageInfo.list;
				 
                  $.each(role,function(index,item){
						var checkboxTd=$("<td></td>").append($("<input></input>")
								.addClass("checkbox")
								.attr("roleName",item.roleName)
								.attr("roleId",item.id)
								.attr( "type","checkbox")).attr("align","center");
						
						var idTd=$("<td></td>").append(item.id);
						var roleNameTd=$("<td></td>").append(item.roleName);
						
						if(item.module ==null || item.module == ""){
							var moduleTd=$("<td></td>");
						}else{
							var moduleTd=$("<td></td>").append(item.module.moduleName)
						}
						
						var editBtn=$("<a></a>").addClass("btn btn-primary updateRole").append("配置");
						var deleteBtn=$("<a class='btn btn-danger deleteRole' >删除</a>")
						editBtn.attr("roleId",item.id);
						editBtn.attr("moduleId",item.moduleId);
						deleteBtn.attr("roleId",item.id);
						deleteBtn.attr("roleName",item.roleName);
						var btnGroupTd=$("<td style='text-align:center;'></td>").append($("<div></div>").addClass("btn-group"));
						
						btnGroupTd.append(editBtn).append(deleteBtn);
						
						$("<tr></tr>").append(checkboxTd)
									  .append(idTd)
									  .append(roleNameTd)
									  .append(moduleTd)
									  .append(btnGroupTd)
									  .appendTo($("#roleMsgTable tbody"));
						
						
					});
		  	}
		
		
			//更新角色 配置角色的权限
			function updateRole(){
				var inputPowers=$("#checkboxGroupPower input:checkbox:checked");
				var  powers= new Array(inputPowers.size());
				$(inputPowers).each(function(index,item){
					//alert(item.value)
					powers[index]=item.value;
				});
				var data="powers="+powers+"&roleId="+$("#roleIdHidden").val();
				$.ajax({
					url:"${APP_PATH}/role",
					type:"PUT",
					data:data,
					success:function(result){
						 if(result.code == 200){
							 //显示失败消息  失败
							 alert(result.extend.msg);
							 //关闭模态框
						 }else{
							// 返回当前页
							 to_page(currentPage);
						 }
						
						//关闭模态框
						$("#roleModal").modal("hide");
					}
				});
			}
		
		</script>
</head>


  <body>
  <!-- 模态框 -->
  <%@include file="/WEB-INF/include/RoleModal.jsp" %>
  
  <!-- container section start -->
  <section id="container" class="">
      <%@include file="/WEB-INF/include/top.jsp"%>

      <%@include file="/WEB-INF/include/left.jsp"%>

      <!--main content start-->
      <section id="main-content" >
          <section class="wrapper">
		  <div class="row">
				<div class="col-lg-12">
					<ol class="breadcrumb">
						<li><i class="fa fa-home"></i><a href="index.jsp">权限管理</a></li>
						<li><i class="fa fa-table"></i>角色管理</li>
					</ol>
					
				</div>
			</div>
	          
             
            
            
              <div class="row" align="center" style="margin:0 auto">
                  <div class="col-lg-12">
                      <section class="panel">
             
                          
                          <table class="table table-striped table-advance table-hover" id="roleMsgTable">
                          <thead>
                          	  <tr>
                                 <th width="8%" style="text-align:center;"><input type="checkbox" id="checkAll" /></th>
                                 <th width="13%">ID</th>
                                 <th width="37%">角色名称</th>
                                 <th width="20%">所属模块</th>
                                 <th width="22%" style="text-align: center;"><span>操作&nbsp;&nbsp;&nbsp;</span>
                                 	<span class="btn-group" >
                                      <a class="btn btn-primary" id="newRole" >新增</a>
                                      <a class="btn btn-danger" id="deleteRoleList">删除</a>
                      				</span>
                                 </th>
                              </tr>
                          </thead>
                           <tbody></tbody>
                           <tfoot>
                           <tr><td colspan="5">
                           
                    <div class="row " >
			<!--分页文字信息  -->
			<div class="col-md-6" id="page_info_area"></div>
			<!-- 分页条信息 -->
			<div class="col-md-6" id="page_nav_area" ></div>
		</div>       
                           
                           </td></tr>
        
                           </tfoot>
                        </table>
                          
                          
                      </section>
                  </div>
              </div>
          </section>
      </section>
      <!--main content end-->
  </section>
  <!-- container section end -->
    <!-- javascripts -->
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <!-- nicescroll -->
    <script src="js/jquery.scrollTo.min.js"></script>
    <script src="js/jquery.nicescroll.js" type="text/javascript"></script>
    <!--custome script for all page-->
    <script src="js/scripts.js"></script>


  </body>
</html>
